<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>亿信聊天室 聊天室</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/public.css">
    <script src="js/jquery-1.10.1.min.js"></script>
    <script src="//cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
    <script src="http://cdn.ronghub.com/RongIMLib-2.3.3.min.js"></script>
    <script src="http://cdn.ronghub.com/RongEmoji-2.2.7.min.js"></script>
    <script src="js/moxie.js"></script>
    <script src="js/qiniu.js"></script>
    <script src="js/plupload.dev.js"></script>
    <script src="js/LiveRoom.js"></script>
    <script src="//imgcache.qq.com/open/qcloud/video/vcplayer/TcPlayer-2.2.2.js" charset="utf-8"></script>
</head>
<body>
<header>
    <div class="top">
        <div class="container">
            <!--未登录状态-->
            <div class="login" style="display: none">
                <div class="top-reg">
                    <div class="denglu fl">
                        <a href="javascript:;"><span><img src="images/icon_wdzh.png" alt="">登陆</span></a>
                    </div>
                    <div class="fl line"></div>
                    <div class="zhuce fl">
                        <a href="javascript:;"><span><img src="images/icon_yhgl.png" alt="">注册</span></a>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="top-tips">
                    <span>游客，您好！</span>
                    您是第666位访问网站的人
                </div>
            </div>
            <!-- 登陆状态 -->
            <div class="login success">
                <div class="top-reg">
                    <div class="qiandao fl">
                        <a href="javascript:;"><span><img src="images/icon_rl.png" alt="">签到</span></a>
                    </div>
                    <div class="fl line"></div>
                    <div class="tongzhi fl">
                        <a href="menber/message.html"><span><img src="images/icon_tz.png" alt="">通知</span></a>
                    </div>
                    <div class="fl line"></div>
                    <div class="tongzhi fl">
                        <a href="menber/menber.html"><span><img src="images/icon_grzx.png" alt="">个人中心</span></a>
                    </div>
                    <div class="fl line"></div>
                    <div class="tongzhi fl">
                        <a href="javascript:;" class="loginout"><span><img src="images/icon_aqtc.png" alt="">安全退出</span></a>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="top-tips">
                    <span class="top_username">xxx</span>
                    ，您好！当前在线人数666人
                </div>
            </div>
        </div>
    </div>
</header>
<!-- 聊天室主体 -->
<div class="chatroom">
    <!--logo-->
    <div class="logo">
        <div class="container container1600">
            <div class="logoimg fl">
                <a href="index.html"><img src="images/icon_logo.png" alt=""></a>
            </div>
            <div class="logoright fr">
                <li class="on"><a href="index.html">首页</a></li>
                <li><a href="javascript:;" class="addroom" style="color: #fff;">创建房间</a></li>
                <li><a href="javascript:;"><img src="images/icon_nav.png" alt=""></a></li>
                <div class="search-box fl">
                    <input type="text" class="search" placeholder="请输入房间ID">
                    <img src="images/icon_search.png" alt="">
                    <div class="result_box">

                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--聊天室界面-->
    <div class="roombox">
        <div class="container container1600">
            <div class="room-left fl">
                <!-- 用户基本信息 -->
                <div class="user-box">
                    <div class="user-logo fl">
                        <img src="images/icon_mrtx1.png" alt="" width="80" height="80">
                    </div>
                    <div class="user-info fl">
                        <div class="user-info-top">
                            <span class="user-name">用户名</span>
                            <a href="javascript:;" data-peopleid="1" class="befans"><span>+ 关注 </span></a>
                        </div>
                        <div class="user-info-bottom">
                            <span class="user-info-zh">ID:45678</span>
                            <span class="room-number">房间号：222</span>
                        </div>
                    </div>
                    <div class="user-staus fl">
                        <img src="images/icon_yyht.png" alt="">
                    </div>
                    <div class="clearfix"></div>
                </div>

                <!-- 聊天室列表 -->
                <div class="room-list">
                    <div class="friends">
                        <a href="javascript:;">
                            <div class="friends-img fl">
                                <img src="images/icon_mrtx.png" alt="">
                            </div>
                            <div class="friends-name fl">
                                <p>好友名称</p>
                            </div>
                            <div class="clearfix"></div>
                        </a>
                    </div>
                </div>
            </div>
            <div class="room-right fl">
                <div class="room-info">
                    <!--<span class="fr">当前排麦：6人</span>-->
                    <p>当前房间人数：666人</p>
                </div>
                <div class="room-chating">
                    <!-- 视频区域 -->

                    <div class="room-video">
                        <div id="id_test_video" style="width:100%; height:auto;"></div>
                    </div>

                    <!-- 视频区域end -->
                    <div class="messagebox">
                        <ul class="chat-list">

                        </ul>
                    </div>
                    <div class="message-bottom">
                        <!-- 发言框上面操作按钮 -->
                        <!--发言框-->
                        <div class="message-speak-box on">
                            <!--没有权限-->
                            <div class="message-speak-apply" style="display: none;">
                                <p><a href="javascript:;">点击申请发言权限<img src="images/icon_djsq.png" alt=""></a></p>
                            </div>
                            <!--已经获取了权限-->
                            <div class="message-speak-text">
                                <div class="speak-box">
                                    <input type="text" placeholder="快来聊天吧~" class="text-input">
                                    <a href="javascript:;" class="emoji"><img src="images/icon_bqb.png" alt=""></a>
                                    <a href="javascript:;" class="image" title="发送图片"><input type="button" class="fsimg" id="fsimg"></a>
                                    <a href="javascript:;" class="fasong">发送</a>
                                </div>
                            </div>
                        </div>
                        <!-- 表情包区域 -->
                        <div class="facebag-box">
                            <div class="facebag">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
    <!--聊天室界面 end -->
</div>
<!--footer-->
<footer>
    <div class="container">
        <div class="footer-list">
            <div class="footer-tit">
                联系我们
            </div>
            <ul>
                <li><a href="tencent://message/?uin=88888888&Site=&menu=yes">商务QQ:11111111</a></li>
                <li>技术咨询:11111111</li>
                <li>联系电话:11111111</li>
            </ul>
        </div>
        <div class="footer-list">
            <div class="footer-tit">
                常见问题
            </div>
            <ul>
                <li><a href="javascript:;">账号问题</a></li>
                <li><a href="javascript:;">常见问题</a></li>
                <li><a href="javascript:;">新手入门</a></li>
            </ul>
        </div>
        <div class="footer-list">
            <div class="footer-tit">
                关于我们
            </div>
            <ul>
                <li><a href="javascript:;">公司介绍</a></li>
                <li><a href="javascript:;">隐私政策</a></li>
                <li><a href="javascript:;">免责声明</a></li>
            </ul>
        </div>
        <div class="footer-list">
            <div class="footer-tit">
                友情链接
            </div>
            <ul>
                <li><a href="javascript:;">xxxx网</a></li>
                <li><a href="javascript:;">xxxx网</a></li>
                <li><a href="javascript:;">xxxx网</a></li>
            </ul>
        </div>
        <div class="footer-list">
            <img src="images/icon_logo1.png" alt="">
        </div>
        <div class="clearfix"></div>
    </div>
</footer>
<div class="copyright">
    <div class="container">
        <div class="fr">川ICP备案号xxxxx号</div>
        <div class="cpr">Copyright ©聊天室网 2014-2018.All rights reseved</div>
    </div>
</div>
<!--fooer end-->

<script>
    $(window).ready(function(){
        if(typeof $.cookie('user_token')=='undefined'||$.cookie('user_token')=='null'){
            alert('请先登陆')
            $(window).attr('location','reg/login.html')
        }
        var videolink='';
        var room_user_id='',
            room_user_head='';
        // 初始加载房间数据
        $.ajax({
            url:'http://120.79.73.159/api/home/get_chatroom_info',
            type:'POST',
            datatype:'json',
            data:{uid:$.cookie('user_id'),token:$.cookie('user_token'),key_words:'',chat_id:$.cookie('room_id'),search_uid:''},
            success:(function(room){
                var info = JSON.parse(room);
                console.log(info);
                info.data.back_data[0].is_attention==0?$('a.befans span').html('+ 关注'):$('a.befans span').html('已关注')
                $.cookie('room_keyword',info.data.back_data[0].key_words)
                $.cookie('room_id',info.data.back_data[0].id,{path:'/'});
                $('.top_username').html($.cookie('user_nickname'));
                $('.user-info-top a.befans').data('peopleid',info.data.back_data[0].user_info.id);
                $('.user-name').html(info.data.back_data[0].user_info.nickname);
                room_user_id=info.data.back_data[0].user_info.id;
                $('.user-info-zh').html('ID：'+info.data.back_data[0].user_info.id);
                $('.room-number').html('房间号：'+info.data.back_data[0].room_number);
                $('.user-logo img').attr('src',info.data.back_data[0].user_info.head);
                room_user_head = info.data.back_data[0].user_info.head;
            })
        });

        //直播
        function getvideo(){
            $.ajax({
                url:'https://room.qcloud.com/weapp/live_room/login?sdkAppID=1400131897&accountType=36361&userID='+$.cookie("user_id")+'&userSig='+$.cookie('user_sign'),
                dataType:'JSON',
                type:'POST',
                success:(function(edata){
                    var tx_token = edata.token;
                    var tx_id = edata.userID;
                    $.ajax({
                        url:'https://room.qcloud.com/weapp/live_room/get_room_list?userID='+tx_id+'&token='+tx_token,
                        dataType:'JSON',
                        type:'POST',
                        data:{
                            index:1,
                            cnt:1000,
                        },success:(function(data){
                            var room = data.rooms;
                            console.log(room);
                            if(room!=''){
                                for(num in room){
                                    if(room[num].pushers[0].userID==room_user_id){
                                        videolink = room[num].mixedPlayURL;
                                        console.log(videolink);
                                        var player =  new TcPlayer('id_test_video', {
                                            "m3u8": videolink,
                                            "flv":videolink , //增加了一个flv的播放地址，用于PC平台的播放 请替换成实际可用的播放地址
                                            "autoplay" : true,      //iOS下safari浏览器，以及大部分移动端浏览器是不开放视频自动播放这个能力的
                                            "coverpic" : "http://pbqt8ydnc.bkt.clouddn.com/a0857201808021911599615.png",
                                            "width" :  '933',//视频的显示宽度，请尽量使用视频分辨率宽度
                                            "height" : '340',//视频的显示高度，请尽量使用视频分辨率高度
                                            "wording": {
                                                2:'房主暂时离开了，请稍等一下哦~',
                                                4: "房主暂时离开了，请稍等一下哦~",
                                                5: "房主暂时离开了，请稍等一下哦~",
                                                13:"直播已经结束啦~",
                                                2032:"房主暂时离开了，请稍等一下哦~~",
                                                2048:"房主暂时离开了，请稍等一下哦~~"
                                            }
                                        });
                                    }else{
                                        console.log(123);
                                    }
                                }
                            }else{
                                // $('#id_test_video').html( '<div class="videobgcover" style="width: 100%;height: 340px; background-image:url('+room_user_head+');background-size: cover;background-position: center center"><p style="text-align: center;font-size: 20px;line-height: 340px;">当前没有直播哦~<p></div>' );
                                $('.room-video').hide();
                                $('.messagebox').css({height:'730px'});
                                $('.chat-list').css({height:'730px'});

                            }

                        }),
                        error:(function(){

                        })
                    })
                })
            });
        }
        getvideo();

        //加载亿信表情包
        (function(){
            var imglist=[];
            var imgli='';
            function pushimg(){
                pushsrc();
                for(var q=1;q<=21;q++){
                    imgsrc='<span class="yxbqb" data-id="'+q+'" data-name="img_bq'+q+'"><img src="'+imglist[q]+'" alt=""></span>';
                    $('.facebag').append(imgsrc);
                }
            }
            function pushsrc() {
                for(var i=0;i<=21;i++){
                    imgli='bqb/img_bq'+i+'.png';
                    imglist.push(imgli)
                }
                var imgsrc = '';
            }
            pushimg();
        })();
        //获取当前房间用户
        function get_people(){
            $.ajax({
                url:'http://120.79.73.159/api/home/get_room_list',
                type:'POST',
                datatype:'json',
                data:{uid:$.cookie('user_id'),token:$.cookie('user_token'),chat_id:$.cookie('room_id')},
                success:(function(room){
                    var info = JSON.parse(room);
                    $('.room-info p').html('当前房间人数：'+(info.data.length+1)+'人');
                    $('.room-list').empty();
                    var text='',
                        user = '';
                    user +=
                        '<div class="friends">'+
                        '<a href="javascript:;">'+
                        '<div class="friends-img fl">'+
                        '<img src="'+ $.cookie('user_head') +'" alt="" width="56" height="56">'+
                        '</div>'+
                        '<div class="friends-name fl">'+
                        '<p>'+$.cookie('user_nickname')+'</p>'+
                        '</div>'+
                        '<div class="clearfix"></div>'+
                        '</a>'+
                        '</div>';
                    for(num in info.data){
                            text +=
                            '<div class="friends">'+
                            '<a href="javascript:;" data-peopleid="'+info.data[num].id+'">'+
                            '<div class="friends-img fl">'+
                            '<img src="'+ info.data[num].head +'" alt="" width="56" height="56">'+
                            '</div>'+
                            '<div class="friends-name fl">'+
                            '<p>'+info.data[num].nickname+'</p>'+
                            '</div>'+
                            '<div class="clearfix"></div>'+
                            '</a>'+
                            '<a href="javascript:;" class="befans"><span>+ 关注 </span></a>'+
                            '</div>';
                    }
                    $('.room-list').append(user);
                    $('.room-list').append(text);

                })
            });
        };
        get_people();
        //添加当前房间用户为好友
        $(document).on('click','.befans',function(){
            var that = this;
            var fans_id = $(that).siblings('a').data('peopleid')||$(that).data('peopleid');
            console.log(fans_id);
            $.ajax({
               url:'http://120.79.73.159/api/personal/attention_someone',
                type:'POST',
                datatype:'json',
                data:{uid:$.cookie('user_id'),token:$.cookie('user_token'),fans_uid:fans_id},
                success:(function(fans){
                    var fan = JSON.parse(fans);
                    console.log(fan);
                    if(fan.ret==200){
                        $(that).children('span').html('关注成功');
                    }else{
                        $.ajax({
                            url:'http://120.79.73.159/api/personal/attention_cancel',
                            type:'POST',
                            datatype:'json',
                            data:{uid:$.cookie('user_id'),token:$.cookie('user_token'),fans_uid:fans_id},
                            success:(function(da){
                                  var ad = JSON.parse(da);
                                  if(ad.ret==200){
                                      console.log(ad.msg);
                                      $(that).children('span').html(' + 关注');
                                  }
                            })
                        })

                    }
                })
            });
        });
        RongIMLib.RongIMEmoji.init();
        (function(){

            $(document).on('click','.bigimgbox',function(){
                $('.imgbig').show();
            });
            $('.warning').click(function(){
                $(this).hide();
            });
            $('.bigimg img').click(function () {
                event.stopPropagation?event.stopPropagation():window.event.cancelBubble = true;
            });
        })();

    });
    //签到窗口
    (function(){
        var qd_time = new Date();
        var qd_year =qd_time.getFullYear();
        var qd_month =qd_time.getMonth()+1<10? '0'+(qd_time.getMonth()+1):(qd_time.getMonth()+1);
        var qd_d =qd_time.getDate();
        var qd_day = qd_time.getDate()<10?'0'+qd_time.getDate():qd_time.getDate();
        var qd_days;
        $.ajax({
            url:'http://120.79.73.159/api/home/sign_famous',
            type:'POST',
            datatype:'json',
            data:{
                uid:$.cookie('user_id'),
                token:$.cookie('user_token')
            },success:(function(ea){
                ea = JSON.parse(ea);
                if(ea.ret==200){
                    days = ea.data.data;
                    function GetDateStr(AddDayCount) {
                        var dd = new Date();
                        dd.setDate(dd.getDate()+AddDayCount);//获取AddDayCount天后的日期
                        var y = dd.getFullYear();
                        var m = dd.getMonth()+1<10?'0'+(dd.getMonth()+1):dd.getMonth()+1;
                        var d = dd.getDate()<10?'0'+dd.getDate():dd.getDate();
                        return y+"-"+m+"-"+d;
                    }
                    daylist =  "<li data-qd='"+GetDateStr(-3)+"'>"+ GetDateStr(-3).substring(8,10) +"</li>" +
                        "<li data-qd='"+GetDateStr(-2)+"'>"+GetDateStr(-2).substring(8,10)+"</li>" +
                        "<li data-qd='"+GetDateStr(-1)+"'>"+GetDateStr(-1).substring(8,10)+"</li>" +
                        "<li data-qd='"+GetDateStr(0)+"'>"+GetDateStr(0).substring(8,10)+"</li>" +
                        "<li data-qd='"+GetDateStr(1)+"'>"+GetDateStr(1).substring(8,10)+"</li>" +
                        "<li data-qd='"+GetDateStr(2)+"'>"+GetDateStr(2).substring(8,10)+"</li>" +
                        "<li data-qd='"+GetDateStr(3)+"'>"+GetDateStr(3).substring(8,10)+"</li>";
                    var qdhtml='';
                    ea.data.is_sign ==0 ? qdhtml = '<div id=\'qiandao\' class="qiandao-success qdbtn">点击签到</div>' : qdhtml = '<div id=\'qiandao\' class="qiandao-success">已签到</div>';
                    $('.qd_days').html(ea.data.days);
                    var fixed =
                        "<div class=\"warning qiandao\">" +
                        "<div class=\"qiandaobox\">" +
                        "<a href=\"javascript:;\" class=\"qiandao-close\">" +
                        "<img src=\"images/icon_closed.png\" alt=\"\"></a>" +
                        "<div class=\"qiandaobg-box\"><div class=\"qiandao-month\">"+qd_month+"月</div>" +qdhtml +
                        "<div class=\"qiandao-num\">已连续签到 <span class='qd_days'>"+ea.data.days+"</span>天</div>" +
                        "</div><div class=\"qiandao-data-box\">" +
                        "<div class=\"qiandao-data-line-box\">" +
                        "<div class=\"qiandao-data-line\"></div>" +
                        "<div class=\"qiandao-data\">" +daylist+
                        "</div></div></div></div></div><div class=\"warning no_login\"><div class=\"warningbox\"><div class=\"waring-img\"><img src=\"images/img_tk_logo.png\" alt=\"\"></div><div class=\"warning-text\">您未获得权限，点击申请授权！</div><div class=\"warning-btn\"><a href=\"reg/reg.html\">申请授权</a></div></div></div>";
                    $('body').prepend(fixed);
                    for(num in days){
                        for(var i =num;i<7;i++){
                            days[num]==$('.qiandao-data li').eq(i).data('qd') ? $('.qiandao-data li').eq(i).addClass('on'): console.log() ;
                        }
                    }
                }else{
                    alert('您已退出或已在其他设备登陆，请重新登陆')
                    $.cookie("user_token",null,{path:'/'});
                    $.cookie("user_head",null,{path:'/'});
                    $.cookie("user_id",null,{path:'/'});
                    $.cookie("user_nickname",null,{path:'/'});
                    $.cookie("user_r_token",null,{path:'/'});
                    $.cookie("user_sign",null,{path:'/'});
                    $.cookie("old_room_id",null,{path:'/'});
                    $.cookie("qdm",null,{path:'/'});
                    $.cookie("qtoken",null,{path:'/'});
                    $.cookie("room_id",null,{path:'/'});
                    $.cookie("user_sign",null,{path:'/'});
                    $.cookie("room_keyword",null,{path:'/'});
                    $.cookie("other_login",null,{path:'/'});
                    $(window).attr('location','reg/login.html');
                }

            })
        });
        $('body').on('click','.qdbtn',function(){
            $.ajax({
                url: 'http://120.79.73.159/api/home/sign_in',
                type: 'POST',
                datatype: 'json',
                data: {
                    uid:$.cookie('user_id'),
                    token:$.cookie('user_token')
                },success:(function(qd){
                    $('#qiandao').html('已签到');
                    $('#qiandao').removeClass('qdbtn');
                })
            });
        });
    })();
    (function(){
        $('.room_password').click(function () {
            event.stopPropagation?event.stopPropagation():window.event.cancelBubble = true;
        });
        $('.newroombox').click(function () {
            event.stopPropagation?event.stopPropagation():window.event.cancelBubble = true;
        });
        $(document).on('click','.qiandao-close',function () {
            $('.warning.qiandao').hide();
        });
        $('.success .qiandao').click(function () {
            $('.warning.qiandao').show();
        });
    })();
    $(document).on('click','.result-btn',function(){
        $.cookie('old_room_id',$.cookie('room_id'),{path:'/'});
        $.cookie('room_id',$(this).data('roomid'),{path:'/'});
        $(window).attr('location','chatroom.html');
    });
</script>
<script src="js/common.js"></script>
<script src="js/chat.js"></script>

</body>
</html>